<template>
  <base-layout
    :visible-sea="false"
    dialog-title="战败"
    :dialog-visible="dialogVisible"
    @dialog-close="dialogClose"
    dialogWidth="30%"
  >
    <template #contentPanel>
      
      <data-table
        :value="tableData.data"
        :has-action="true"
        :table-column-attributes="tableColumnAttributes"
        :width="160"
        :isShowPage="false"
      >
        <template #action="{ row }">
          <i
            class="el-icon-edit"
            title="战败"
            style="margin-left: 15px; cursor: pointer"
            @click="interestsInfo(row, 0)"
          ></i>
        </template>
      </data-table>
    </template>
    <template #dialog>
      <el-form
        ref="defeatForm"
        :model="defeatForm"
        :rules="rules"
        label-width="120px"
      >
        <el-form-item label="战败原因:" prop="checkBoxJson">
          <el-checkbox-group v-model="defeatForm.checkBoxJson">
            <el-checkbox label="{buyCarSchedule: '暂时没有购车打算'}" value="{buyCarSchedule: '暂时没有购车打算'}"
              >暂时没有购车打算</el-checkbox
            >
            <el-checkbox
              label="{endOfYearBuyWechatFollow: '可能考虑年底购车，添加微信跟进'}"
              value="{endOfYearBuyWechatFollow: '可能考虑年底购车，添加微信跟进'}"
              >可能考虑年底购车，添加微信跟进</el-checkbox
            >
            <el-checkbox label="{lackOfMoney: '资金暂时不到位'}" value="{lackOfMoney: '资金暂时不到位'}"
              >资金暂时不到位</el-checkbox
            >
            <el-checkbox label="{lackOfDiscount: '觉得优惠少了点'}" value="{lackOfDiscount: '觉得优惠少了点'}"
              >觉得优惠少了点</el-checkbox
            >
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="邀约备注:" prop="remark">
          <el-input type="textarea" v-model="defeatForm.remark" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer text-center">
        <!-- <el-button @click="dialogVisible = false">取 消</el-button> -->
        <el-button type="primary" @click="defeatSave('defeatForm')"
          >确 定</el-button
        >
      </div>
    </template>
  </base-layout>
</template>

<script>
import baseMixin from '@/mixins/base'
import { indexApis } from '@/api/pre-sale/intentionalCustomer'
const type = {
  buyCarSchedule: '暂时没有购车打算',
  endOfYearBuyWechatFollow: '可能考虑年底购车，添加微信跟进',
  lackOfMoney: '资金暂时不到位',
  lackOfDiscount: '觉得优惠少了点',
}
export default {
  mixins: [
    baseMixin({
      findData: indexApis.intentiongGJFindAll,
      idName: 'id',
      dataName: [''],
    }),
  ],
  created() {
    this.searchOptions = {
      intentionId: this.id,
      type: 3,
    }
  },
  data() {
    return {
      defeatForm: {
        checkBoxJson: [],
        remark: '',
      },
      rules: {
        checkBoxJson: [
          { required: true, message: '请选择原因', trigger: 'blur' },
        ],
        remark: [{ required: true, message: '邀约备注', trigger: 'blur' }],
      },
      tableColumnAttributes: [
        { name: '意向车型', value: 'carModelName', type: 'text' },
        { name: '购车预算', value: 'budget', type: 'text' },
        { name: '战败时间', value: 'createTime', type: 'text' },
        { name: '操作人', value: 'createUserName', type: 'text' },
        { name: '备注', value: 'remark', type: 'text' },
      ],
    }
  },
  methods: {
    //修改
    interestsInfo(row) {
      if (typeof row.checkBoxJson === 'string') {
        row.checkBoxJson = JSON.parse(row.checkBoxJson)
      }
        this.currentItem = row

      this.dialogVisible = true
      this.$nextTick(()=>{
   
        this.defeatForm={
          checkBoxJson:row.checkBoxJson,
          remark:row.remark
        }

      })
    },
    defeatSave(formName) {
      this.$refs[formName].validate(async (valid) => {
        if (valid) {
          const params = Object.assign({}, this.defeatForm)
           params.id = this.currentItem.id

          // let d = params.checkBoxJson.map((item) => {
          //   return {
          //     [item]: type[item],
          //   }
          // })
          params.checkBoxJson = JSON.stringify(params.checkBoxJson)

          await indexApis.intentiongDefeated(params)
          this.setTableData()
          this.dialogClose()
          this.$refs[formName].resetFields()
        }
      })
    },
    dialogClose() {
      this.dialogVisible = false
    },
  },
}
</script>

<style lang="scss" scoped>
</style>
